<template>
    <div>
        <div style="width: 100%;height: 80px;">
            <el-button type="primary" icon="el-icon-arrow-left" @click="bank">上一页</el-button>
            <h2>简历管理</h2>
            <div class="box">
                
                <el-button type="primary" @click="addd = true" style="flex-shrink: 0;">新增简历</el-button>
                <el-button type="primary" style="margin-left: -1px;flex-shrink: 0;" @click="dialogFormVisible = true">提醒规则</el-button>
                
            </div>
            <div style="margin-left: 690px;margin-top: -35px;;">
                <el-upload class="upload-demo" 
                    :auto-upload="false"
                    :on-change="handleChange">
                    <el-button size="small" type="primary" style="width: 97px;height: 36px; font-size: 14px;flex-shrink: 0; ">点击上传</el-button>
                </el-upload>
            </div>
        </div>
        
        <div class="first">
            <el-checkbox  style="margin-top: 22px;margin-left: 20px;"></el-checkbox>
            <div class="one_box">
                <div class="first_one" style="margin-left: 25px">姓名</div>
                <div class="first_one" style="margin-left: -10px">应聘岗位</div>
                <div class="first_one" style="margin-left: -1px;">人才渠道来源</div>
                <div class="first_one" style="margin-left: 45px;">手机号</div>
                <div class="first_one" style="margin-left: 10px">工作经验</div>
                <div class="first_one" style="margin-left:5px;">简历分类</div>
                <div class="first_one">推送时间</div>

                <div class="first_one" style="width: 80px;;margin-left: 75px">操作</div>
                <div class="first_one" style="margin-left: 100px;">面试结果</div>
            </div>
        </div>
        <div class="two" v-for="(item, index) in zzy" :key="index">
            <el-checkbox  style="margin-top: 15px;margin-left: 20px;"></el-checkbox>
            <div class="two-two">
                <div class="two_box">{{ item.name }}</div>
                <div class="two_box" style="margin-left: 15px;">{{ item.positionName }}</div>
                <div class="two_box">{{ item.source }}</div>
                <div class="two_box" style="margin-left: 0px;">{{ item.phone }}</div>
                <div class="two_box" style="margin-left: 45px;">{{ item.workExperience }}</div>
                <div class="two_box" style="margin-left: -5px;"> {{ item.classify }}</div>
                <div class="two_box" style="margin-left: -5px"> {{ item.airTime }}</div>
                <template>
                    <el-button type="text" @click="open(item)"> <el-button type="primary"
                            style="width: 90px;margin-top: -20px;padding: 12px;">人事面试</el-button>
                    </el-button>
                </template>
                <template>
                    <el-button type="text" @click="openone(item)"> <el-button type="primary"
                            style="width: 90px;margin-top: -20px;padding: 12px;">业务面试</el-button>
                    </el-button>

                </template>
                <template>
                    <el-button type="text" @click="opentwo(item)"> <el-button type="primary"
                            style="width: 90px;margin-top: -20px;padding: 12px;margin-left: 40px;">是否录取</el-button>
                    </el-button>

                </template>

            </div>
        </div>
        <div>
            <el-dialog title="提醒规则设置" :visible.sync="dialogFormVisible">
                <el-form >
                    <div class="tan">
                        <img class="tan_tu" src="../../assets/img/add.png" alt="">
                        <img class="tan_tu" src="../../assets/img/jian.png" alt="">
                    </div>
                    <div class="tan_one">
                        <el-checkbox  style="margin-top: 12px;margin-left: 20px;"></el-checkbox>
                        <div class="tan_one_one">
                            <div>ID</div>
                            <div>动作名称</div>
                            <div>动作类型</div>
                            <div>动作说明</div>
                            <div>是否启用</div>
                        </div>
                    </div>

                    <div class="tan_one">
                        <el-checkbox  style="margin-top: 12px;margin-left: 20px;"></el-checkbox>
                        <div class="tan_one_one">
                            <div>666</div>
                            <div>是否按照区域划分简历</div>
                            <div>提示/提醒</div>
                            <el-switch v-model="value" active-color="#13ce66" inactive-color="#ff4949"
                                style="margin-top: 10px;">
                            </el-switch>

                        </div>

                    </div>

                </el-form>
                <div slot="footer" class="dialog-footer">
                    <el-button @click="dialogFormVisible = false">取 消</el-button>
                    <el-button type="primary" @click="dialogFormVisible = false">确 定</el-button>
                </div>
            </el-dialog>
        </div>
        <!-- <div class="block">
            <el-pagination 
                 :page-size="100" layout="total, prev, pager, next" :total="1000">
            </el-pagination>
        </div> -->


        <el-dialog title="候选人" :visible.sync="addd" style="width: 150%;margin-left: -270px;margin-top: -100px; ">
            <el-form >
                <div class="people">
                    <h3 style="font-size: 20px;margin-left: -20px;">个人信息</h3>
                    <div class="name">
                        <span>姓名</span>
                        <el-input v-model="username" placeholder="请输入内容"></el-input>
                    </div>
                    <div class="sex">
                        <div class="sex-one">性别</div>
                        <el-radio v-model="sex" label="1" style="margin-left: -50px;"><img class="a"
                                src="../../assets/img/man.png" alt=""></el-radio>
                        <el-radio v-model="sex" label="2"><img class="a" src="../../assets/img/women.png"
                                alt=""></el-radio>
                    </div>
                    <div class="phone">
                        <div class="phone-one">联系手机号</div>
                        <el-input v-model="phone" placeholder="请输入内容"></el-input>
                    </div>
                    <div class="email">
                        <div class="phone-one">应聘岗位</div>
                        <el-input v-model="positionName" placeholder="请输入内容"></el-input>
                    </div>
                    <div class="up">
                        <div class="phone-one">简历附件</div>
                        <el-upload class="upload-demo" style="margin-top: 10px;" drag
                            action="https://jsonplaceholder.typicode.com/posts/" multiple>
                            <img src="../../assets/img/updata.png" alt=""
                                style="width: 30px;height: 30px;flex-shrink: 0;margin-left: -230px;">
                            <div class="el-upload__text">将文件拖到此处，或<em>点击上传</em></div>
                        </el-upload>
                    </div>
                    <div class="userid">
                        <div class="phone-one">身份证号</div>
                        <el-input v-model="Idcard" placeholder="请输入内容"></el-input>
                    </div>
                    <div class="email">
                        <div class="phone-one">工作经验</div>
                        <el-input v-model="workExperience" placeholder="请输入内容"></el-input>
                    </div>
                    <div class="userid">
                        <div class="phone-one">人才渠道来源</div>
                        <el-input v-model="source" placeholder="请输入内容"></el-input>
                    </div>
                    <div class="email">
                        <div class="phone-one">简历分类</div>
                        <el-input v-model="classify" placeholder="请输入内容"></el-input>
                    </div>
                   
                </div>
            </el-form>
            <div slot="footer" class="dialog-footer" style="margin-top: -50px;">
                <el-button @click="addd = false">取 消</el-button>
                <el-button type="primary" @click="AddRes">确 定</el-button>
            </div>
        </el-dialog>

    </div>

</template>

<script>
    import { SelectURC,AddResume,Updatepersonnel,Updatetechnical,interviewstatus} from "../../api/share"
    import { upload } from "../../utils/upload";

export default {
 
    data() {
        return {
            pickerOptions: {
          disabledDate(time) {
            return time.getTime() > Date.now();
          },
        },
            value1:'',
            input: '',
            value: true,
            radio: '1',
            
            zzy: [],
            dialogTableVisible: false,
            dialogFormVisible: false,
            addd: false,
            formLabelWidth: '120px',
           
                username:'',
                sex:'',
                positionName:'',
                Idcard:'',
                source:'',
                phone:'',
                workExperience:'',
                classify:'',  
                ID:null,
                user:'乔锦辉'   ,
                enroll:null,       
        }
    },
    mounted(){
            this.SelURC();
    },
    methods: {
        //上传文件
        handleChange(event){
        upload(event.raw).then(res => {
            this.getFileName()
            console.log(res)
        })
        },
        AddRes(){
            this.addd=false
            AddResume(this.username,this.sex,this.positionName,this.Idcard,this.source,this.phone,this.workExperience,this.classify).then(res=>{
                console.log(res);
                this.SelURC;
            })
        },

        SelURC(){
            SelectURC().then(res=>{
                console.log(res);
                this.zzy=res.result
            }).catch(err=>{
                console.log(err);
                
            })
        },

        
        bank() {
            this.$router.push("/pay/Order");
        },
        open(item) {
            this.ID=item.id,
            this.$confirm('确定要面试吗？', {
                confirmButtonText: '确定',
                cancelButtonText: '取消',
                type: 'warning'
            }).then(() => {
                Updatepersonnel(this.ID,this.user).then(res=>{
                        console.log(res);
                        this.ID=null;
                    }),
                this.$message({
                    type: 'success',
                    message: '操作成功!'
                    
                });
            }).catch(() => {
                this.$message({
                    type: 'info',
                    message: '操作已取消'
                });
            });
        },
        openone(item) {
            this.ID=item.id,
            this.$confirm('确定要面试吗？', {
                confirmButtonText: '确定',
                cancelButtonText: '取消',
                type: 'warning'
            }).then(() => {
                Updatetechnical(this.ID,this.user).then(res=>{
                        console.log(res);
                        this.ID=null;
                    }),
                this.$message({
                    
                    type: 'success',
                    message: '操作成功!',

                });
            }).catch(() => {
                this.$message({
                    type: 'info',
                    message: '操作已取消'
                });
            });
        },
        opentwo(item) {
            this.ID=item.id,
            this.$confirm('确定要录取该人员吗？', {
                confirmButtonText: '确定',
                cancelButtonText: '取消',
                type: 'warning'
            }).then(() => {
                this.enroll=1;
                interviewstatus(this.ID,this.user,this.enroll).then(res=>{
                    console.log(res);
                    this.ID=null;
                    this.enroll=null;
                    this.$router.push("/personnel/personnel");
                })
                this.$message({
                    type: 'success',
                    message: '录取成功!'
                });

            }).catch(() => {
                this.enroll=2
                interviewstatus(this.ID,this.user,this.enroll).then(err=>{
                    console.log(err);
                    this.ID=null;
                    this.enroll=null;
                })
                this.$message({
                    type: 'info',
                    message: ''
                });
            });
        }

    },




}
</script>

<style>
h2 {
    width: 100px;
    margin-left: 550px;
    margin-top: -30px;
}

.box {
    display: flex;
    width: 300px;
    margin-top: -62px;
    margin-left: 900px;
    display: flex;
    justify-content: space-evenly;
}

.first {
    width: 1240px;
    height: 60px;

    margin-top: 10px;
    display: flex;
    justify-content: space-evenly;
}

.first_one {
    width: 100px;
    height: 60px;
    line-height: 60px;
    flex-shrink: 0;
    margin-left: 10px;

}

.two {
    width: 1240px;
    height: 40px;

    margin-top: 10px;
    display: flex;

}

.two_box {
    width: 100px;
    height: 40px;
    flex-shrink: 0;
    line-height: 40px;
    margin-left: 10px;
}

.two-two {
    width: 1186px;
    height: 40px;
    display: flex;
    margin-left: 25px;
    flex-shrink: 0;
}

.one_box {
    width: 1186px;
    height: 60px;
    display: flex;
    margin-left: 20px;
    flex-shrink: 0;
    /* justify-content: space-evenly; */

}

.block {
    margin-left: 800px;

}

.tan_tu {
    width: 20px;
    height: 20px;
    margin-left: 10px;
}

.tan {
    width: 60px;
    display: flex;
    margin-top: -30px;
    margin-left: 650px;
}

.tan_one {
    width: 100%;
    height: 40px;
    margin-top: 10px;
    display: flex;
    flex-wrap: wrap;
}

.tan_one_one {
    width: 90%;
    margin-left: 5%;
    flex-shrink: 0;
    display: flex;
    justify-content: space-around;
    line-height: 40px;
}

.people {
    width: 1000px;
    height: 500px;
    margin-left: 50px;
    margin-top: -45px;
}

.name {
    width: 400px;
    height: 50px;
    flex-wrap: wrap;
    display: flex;
    font-size: 18px;
}

.a {
    width: 15px;
    height: 15px;
    margin-top: 10px;
}

.sex {
    width: 150px;
    height: 50px;
    display: flex;
    margin-left: 400px;
    margin-top: -30px;
}

.sex-one {
    width: 50px;
    height: 30px;
    flex-shrink: 0;
    margin-top: -20px;
    font-size: 18px;
    margin-left: 80px;
}

.phone {
    width: 400px;
    height: 55px;
    flex-shrink: 0;
    display: flex;
    flex-wrap: wrap;
}

.phone-one {
    height: 20px;
    flex-shrink: 0;
    font-size: 18px;
}

.email {
    width: 400px;
    height: 55px;
    flex-shrink: 0;
    display: flex;
    flex-wrap: wrap;
    margin-left: 480px;
    margin-top: -55px;
}

.up {
    width: 880px;
    height: 55px;
    flex-shrink: 0;
    display: flex;
    flex-wrap: wrap;
    margin-top: 10px;
}

.el-upload-dragger {
    width: 880px;
    height: 30px;
    flex-shrink: 0;
}

.el-icon-upload {
    width: 20px;
    height: 20px;
    flex-shrink: 0;
}

.el-upload__text {
    margin-top: -28px;

}

.userid {
    width: 400px;
    height: 55px;
    flex-shrink: 0;
    display: flex;
    flex-wrap: wrap;
    margin-top: 25px;
}

.el-input__inner {
    margin-top: 5px;
}

</style>